// import axios from 'axios'
// import { MessageBox, Message } from 'element-ui'
// import store from '@/store'
// import { getToken } from '@/utils/auth'

// // create an axios instance
// const service = axios.create({
//   baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url
//   // withCredentials: true, // send cookies when cross-domain requests
//   timeout: 5000 // request timeout
// })

// // request interceptor
// service.interceptors.request.use(
//   config => {
//     // do something before request is sent

//     if (store.getters.token) {
//       // let each request carry token
//       // ['X-Token'] is a custom headers key
//       // please modify it according to the actual situation
//       config.headers['X-Token'] = getToken()
//     }
//     return config
//   },
//   error => {
//     // do something with request error
//     console.log(error) // for debug
//     return Promise.reject(error)
//   }
// )

// // response interceptor
// service.interceptors.response.use(
//   /**
//    * If you want to get http information such as headers or status
//    * Please return  response => response
//   */

//   /**
//    * Determine the request status by custom code
//    * Here is just an example
//    * You can also judge the status by HTTP Status Code
//    */
//   response => {
//     const res = response.data

//     // if the custom code is not 20000, it is judged as an error.
//     if (res.code !== 20000) {
//       Message({
//         message: res.message || 'Error',
//         type: 'error',
//         duration: 5 * 1000
//       })

//       // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
//       if (res.code === 50008 || res.code === 50012 || res.code === 50014) {
//         // to re-login
//         MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
//           confirmButtonText: 'Re-Login',
//           cancelButtonText: 'Cancel',
//           type: 'warning'
//         }).then(() => {
//           store.dispatch('user/resetToken').then(() => {
//             location.reload()
//           })
//         })
//       }
//       return Promise.reject(new Error(res.message || 'Error'))
//     } else {
//       return res
//     }
//   },
//   error => {
//     console.log('err' + error) // for debug
//     Message({
//       message: error.message,
//       type: 'error',
//       duration: 5 * 1000
//     })
//     return Promise.reject(error)
//   }
// )

// export default service
// // 导出一个axios的实例  而且这个实例要有请求拦截器 响应拦截器

// import axios from 'axios'
// import { Message } from 'element-ui'
// const service = axios.create({
//   // 如果执行 npm run dev  值为 /api 正确  /api 这个代理只是给开发环境配置的代理
//   // 如果执行 npm run build 值为 /prod-api  没关系  运维应该在上线的时候 给你配置上 /prod-api的代理
//   // baseURL: process.env.VUE_APP_BASE_API, // 设置axios请求的基础的基础地址
//   baseURL: 'http://geek.itheima.net',
//   timeout: 5000 // 定义5秒超时
// }) // 创建一个axios的实例
// service.interceptors.request.use() // 请求拦截器
// // 响应拦截器
// service.interceptors.response.use(
//   (response) => {
//     // axios默认加了一层data
//     const { success, message, data } = response.data
//     // const res = response.data
//     //   要根据success的成功与否决定下面的操作
//     if (success) {
//       return data
//     } else {
//       // 业务已经错误了 还能进then ? 不能 ！ 应该进catch
//       Message.error(message) // 提示错误消息
//       return Promise.reject(new Error(message))
//     }
//   },
//   (error) => {
//     Message.error(error.message) // 提示错误信息
//     return Promise.reject(error) // 返回执行错误 让当前的执行链跳出成功 直接进入 catch
//   }
// )

// export default service // 导出axios实例

import axios from 'axios'
import store from '@/store'
import { Message } from 'element-ui'
import message from 'element-ui/packages/message'
import router from '@/router'
import { getTimeStamp } from '@/utils/auth'

// 和后端协商：你token过期的时间是多少？
// 开发的时候：超时时间设置长一点，不然会一直提示token过期
const timeOut = 2 * 24 * 60 * 60 * 1000 // 单位为ms  表示的是1小时

const checkTimeOut = () => {
  // 如果返回true证明过期了
  // 如果返回false没有过期的
  //  用当前的时间-登录时候存储的时间 > 超时的时间
  return Date.now() - getTimeStamp() > timeOut
}

// token失效前端主动介入的处理逻辑
// 核心判断：本地存储一个过期的时间，每一次请求的时候，判断token存储在本地的时候是否超过了这个过期时间
//         如果超过了就过期了，否则就是可用的

// 只要当前token过期了，或者token不可用了，后端都会返回401
// 我们拿到401的状态码 ==> token不能用了 ==> 让用户重新登录
const service = axios.create({
  baseURL: 'http://geek.itheima.net', // url = base url + request url
  // withCredentials: true, // send cookies when cross-domain requests
  headers: {
    'Content-Type': 'application/json'
  }
})

service.interceptors.request.use(
  (config) => {
    //  注入token
    //  判断是否有token，如果有再进行注入
    const token = store.getters.token
    if (token) {
      // 判断token是否过期
      if (checkTimeOut()) {
        //  执行退出登录的操作
        store.dispatch('user/logout')
        router.push('/login')
        message.error('登录信息过期')
        return Promise.reject(new Error('token过期'))
      }
      config.headers.Authorization = `Bearer ${token}`
    }
    return config // 必须返回一个修改好的配置项
  },
  (err) => {
    return Promise.reject(err)
  }
)
// 响应拦截器 （response）
// 什么时候走成功？什么时候走失败？
//
service.interceptors.response.use(
  (response) => {
    // 只有200-300之间的状态码会走成功，其余的状态码会走失败
    const { message, success, data } = response.data
    if (success || message === 'OK') {
      return data
    } else {
      //  接口请求出错，让接口报错
      Message.error(message)
      return Promise.reject(new Error(message))
    }
  },
  (err) => {
    // 接口状态码出错的时候，判断它的状态码是不是401，如果是401说明token过期了，就需要重新登录
    // 401判断token失效提倡的一种规范的做法
    // 我们人资接口就是按照这种规范去设计的接口
    // 所以我们可以直接判断401
    // 如果是我们公司开发的时候，先跟后端确认一下，如果token过期，他会给我们返回什么？按照后端返回的数据格式去进行判断
    if (err.response.status === 401) {
      //  退出登录
      store.dispatch('user/logOut')
      //  跳转登录界面
      router.push('/login')
    }
    // 不需要在接口具体请求的地方进行提示
    Message.error(err.response.data.message || '系统错误，请稍后重试')
    return Promise.reject(err)
  }
)

// 当前配置好的axios实例导出
// 搭建项目的时候不涉及业务逻辑，搭建基本架子，再去填充代码
export default service

export const a = 'a'
